﻿@{
    ViewData["Title"] = "添加仓位定义信息";
    Layout = null;
}

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewData["Title"]</title>
    <link href="~/libs/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
    <style>
        body {
            font-family: Arial, sans-serif;
            padding: 20px;
            background-color: #f9f9f9;
        }

        .form-container {
            max-width: 800px;
            margin: 0 auto;
            background-color: #fff;
            padding: 20px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }

        .layui-form-label {
            width: 120px;
        }

        .layui-input-block {
            margin-left: 150px;
        }

        .layui-form-item {
            margin-bottom: 15px;
        }
    </style>
</head>
<body>

    <div class="form-container">
        <form class="layui-form" lay-filter="addForm">
            <!-- 仓库 -->
            <div class="layui-form-item">
                <label class="layui-form-label">仓库：</label>
                <div class="layui-input-block">
                    <input type="number" name="repositoryId" lay-verify="required|number" placeholder="请输入仓库" class="layui-input">
                </div>
            </div>

            <!-- 库位类型 -->
            <div class="layui-form-item">
                <label class="layui-form-label">库位类型：</label>
                <div class="layui-input-block">
                    <input type="number" name="theLocationType" lay-verify="required|number" placeholder="请输入库位类型" class="layui-input">
                </div>
            </div>

            <!-- 库位编码 -->
            <div class="layui-form-item">
                <label class="layui-form-label">库位编码：</label>
                <div class="layui-input-block">
                    <input type="text" name="theLocationCode" lay-verify="required" placeholder="请输入车间编码" autocomplete="off" style="width:300px" class="layui-input">
                </div>
            </div>

            <!-- 所属客户 -->
            <div class="layui-form-item">
                <label class="layui-form-label">所属客户：</label>
                <div class="layui-input-block">
                    @* 动态绑定货主下拉框 *@
                    <select name="customer" lay-verify="required">
                        <option value="">请选择货主</option>
                    </select>
                </div>
            </div>

            <!-- 库位属性 -->
            <div class="layui-form-item">
                <label class="layui-form-label">库位属性：</label>
                <div class="layui-input-block">
                    <input type="number" name="binLocationAttributes" lay-verify="required|number" placeholder="请输入库位属性" class="layui-input">
                </div>
            </div>

            <!-- 产品属性 -->
            <div class="layui-form-item">
                <label class="layui-form-label">产品属性：</label>
                <div class="layui-input-block">
                    <input type="number" name="productAttributes" lay-verify="required|number" placeholder="请输入产品属性" class="layui-input">
                </div>
            </div>

            <!-- 停用 -->
            <div class="layui-form-item">
                <label class="layui-form-label">停用：</label>
                <div class="layui-input-block">
                    @*   <input type="text" name="deactivated" lay-verify="required" placeholder="请输入停用" class="layui-input"> *@
                    <input type="checkbox" name="deactivated" lay-skin="switch"> 停用
                </div>
            </div>

            <!-- 取货次序 -->
            <div class="layui-form-item">
                <label class="layui-form-label">取货次序：</label>
                <div class="layui-input-block">
                    <input type="number" name="pickupOrder" lay-verify="required|number" placeholder="请输入取货次序" class="layui-input">
                </div>
            </div>

            <!-- 最大体积 -->
            <div class="layui-form-item">
                <label class="layui-form-label">最大体积：</label>
                <div class="layui-input-block">
                    <input type="number" name="maxVolume" lay-verify="required|number" placeholder="请输入最大体积" class="layui-input">
                </div>
            </div>

            <!-- 最大重量 -->
            <div class="layui-form-item">
                <label class="layui-form-label">最大重量：</label>
                <div class="layui-input-block">
                    <input type="number" name="maxWeight" lay-verify="required|number" placeholder="请输入最大重量" class="layui-input">
                </div>
            </div>

            <!-- 上架次序 -->
            <div class="layui-form-item">
                <label class="layui-form-label">上架次序：</label>
                <div class="layui-input-block">
                    <input type="number" name="listingOrder" lay-verify="required|number" placeholder="请输入上架次序" class="layui-input">
                </div>
            </div>

            <!-- 宽度 -->
            <div class="layui-form-item">
                <label class="layui-form-label">宽度：</label>
                <div class="layui-input-block">
                    <input type="number" name="wide" lay-verify="required|number" placeholder="请输入宽度" class="layui-input">
                </div>
            </div>

            <!-- 长度 -->
            <div class="layui-form-item">
                <label class="layui-form-label">长度：</label>
                <div class="layui-input-block">
                    <input type="number" name="long" lay-verify="required|number" placeholder="请输入长度" class="layui-input">
                </div>
            </div>

            <!-- 高度 -->
            <div class="layui-form-item">
                <label class="layui-form-label">高度：</label>
                <div class="layui-input-block">
                    <input type="number" name="high" lay-verify="required|number" placeholder="请输入高度" class="layui-input">
                </div>
            </div>

            <!-- 最大托盘 -->
            <div class="layui-form-item">
                <label class="layui-form-label">最大托盘：</label>
                <div class="layui-input-block">
                    <input type="text" name="largestPallets" lay-verify="required" placeholder="请输入最大托盘" class="layui-input">
                </div>
            </div>

            <!-- X 坐标 -->
            <div class="layui-form-item">
                <label class="layui-form-label">X 坐标：</label>
                <div class="layui-input-block">
                    <input type="number" name="xcoordinates" lay-verify="required|number" placeholder="请输入 X 坐标" class="layui-input">
                </div>
            </div>

            <!-- Y 坐标 -->
            <div class="layui-form-item">
                <label class="layui-form-label">Y 坐标：</label>
                <div class="layui-input-block">
                    <input type="number" name="ycoordinates" lay-verify="required|number" placeholder="请输入 Y 坐标" class="layui-input">
                </div>
            </div>

            <!-- Z 坐标 -->
            <div class="layui-form-item">
                <label class="layui-form-label">Z 坐标：</label>
                <div class="layui-input-block">
                    <input type="number" name="zcoordinates" lay-verify="required|number" placeholder="请输入 Z 坐标" class="layui-input">
                </div>
            </div>

            <!-- 提交按钮 -->
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="submitBtn">修改</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>

    <script src="~/libs/jquery/jquery.js"></script>
    <script src="~/libs/layui-v2.5.6/layui/layui.js"></script>
    <script>
        $(function () {
            // 页面初始化
            initPage();
        });

        // 初始化页面
        function initPage() {
            bindCustomerSelect(); // 绑定货主下拉框
            loadFormData();       // 加载表单数据
        }

        // 动态绑定货主下拉框
        function bindCustomerSelect() {
            layui.use(['form'], function () {
                var form = layui.form;
                $.ajax({
                    url: '/ProductDetail/BindClientName', // 获取货主列表地址
                    type: 'get',
                    async: false,
                    dataType: 'json',
                    success: function (res) {
                        if (Array.isArray(res)) { // 确保返回的是数组
                            var options = '<option value="">请选择货主</option>'; // 默认选项
                            $.each(res, function (i, item) {
                                if (item.id && item.chineseName) { // 确保数据字段存在
                                    options += `<option value="${item.id}">${item.chineseName}</option>`;
                                }
                            });
                            $('select[name="customer"]').html(options); // 填充下拉框
                            form.render('select'); // 刷新选择框渲染
                        } else {
                            console.error('返回数据格式不正确');
                            layui.layer.msg('获取货主列表失败，数据格式不正确', { icon: 2 });
                        }
                    },
                    error: function () {
                        console.error('获取货主列表失败');
                        layui.layer.msg('获取货主列表失败，请稍后重试', { icon: 2 });
                    }
                });
            });
        }

        // 加载表单数据
        function loadFormData() {
            $.ajax({
                url: "/BinLocationDefinition/GetBinLocationDefiById",
                data: { id: @ViewBag.Id },
                type: "get",
                async: true,
                dataType: "json",
                success: function (res) {
                    if (res) {
                        // 填充表单数据
                        layui.use(['form'], function () {
                            var form = layui.form;
                            form.val('addForm', {
                                repositoryId: res.repositoryId,
                                theLocationType: res.theLocationType,
                                theLocationCode: res.theLocationCode,
                                customer: res.customer,
                                binLocationAttributes: res.binLocationAttributes,
                                productAttributes: res.productAttributes,
                                deactivated: res.deactivated == 1, // 处理停用状态
                                pickupOrder: res.pickupOrder,
                                maxVolume: res.maxVolume,
                                maxWeight: res.maxWeight,
                                listingOrder: res.listingOrder,
                                wide: res.wide,
                                long: res.long,
                                high: res.high,
                                largestPallets: res.largestPallets,
                                xcoordinates: res.xcoordinates,
                                ycoordinates: res.ycoordinates,
                                zcoordinates: res.zcoordinates
                            });
                            form.render(); // 刷新表单渲染
                        });
                    } else {
                        layui.layer.msg('加载数据失败', { icon: 2 });
                    }
                },
                error: function () {
                    layui.layer.msg('请求失败，请检查网络', { icon: 2 });
                }
            });
        }

        // 修改表单提交
        layui.use(['form', 'layer'], function () {
            var form = layui.form;
            var layer = layui.layer;

            // 监听表单提交
            form.on('submit(submitBtn)', function (data) {
                var field = data.field;
                field.id = @ViewBag.Id; // 添加 ID 到提交数据
                    data.field.theLocationBarcode ="库位1",
                data.field.remark="很好",
                data.field.elabelId="王明签",
                data.field.outboundPort="东方",
                data.field.locationGroup="一组",
                field.deactivated = field.deactivated ? 1 : 0; // 处理停用状态

                // 提交到后端接口
                $.ajax({
                    url: '/BinLocationDefinition/UpdateBinLocationDefi', // 提交地址
                    type: 'post',
                    data: field,
                    dataType: 'json',
                    success: function (res) {
                        if (res == 1) {
                            layer.msg('修改成功', { icon: 1 });
                            setTimeout(function () {
                                returnList();
                            }, 500);
                        } else if (res == -1) {
                            layer.msg('库位编号已存在', { icon: 2 });
                        } else {
                            layer.msg('修改失败', { icon: 2 });
                        }
                    },
                    error: function () {
                        layer.msg('请求失败，请检查网络', { icon: 2 });
                    }
                });
                return false; // 阻止表单默认提交
            });
        });

        // 返回列表页面
        function returnList() {
            var index = parent.layer.getFrameIndex(window.name); // 先得到当前 iframe 层的索引
            parent.layer.close(index); // 再执行关闭
        }
    </script>
</body>
</html>
